<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="js/vue.min.js"></script>
		<script src="js/bootstrap.min.js"></script>
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
		<style type="text/css">
			.box{
				width: 200px;
				height: 200px;
				background: red;
			}
		</style>
	</head>
	<body>
		<div id="app">
			<bntton class="btn btn-success" @click="ifshow=!ifshow">if显示/隐藏{{ifshow}}</bntton>
			<div class="box" v-if="ifshow">
				我是if切换的div
			</div>
			<hr />
			<bntton class="btn btn-success"  @click="showshow=!showshow">show显示/隐藏{{showshow}}</bntton>
			<div class="box" v-if="showshow">
				我是show切换的div
			</div>
		</div>
		<script>
			new Vue({
				el:'#app',
				data:{
					ifshow:true,
					showshow:true
				}
			})
		</script>
	</body>
</html>
